<div ng-include="'components/navbar/navbar-home.html'"></div>
<!-- Header Wrapper -->
<header fade-in>
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <a class="logo" href="/"><img src="images/simply-decide-logo.png" /></a>
                <h1>A Collective Decision</h1>
                <p class="h1-sub">making experience for FREE</p>
                <div class="stats">
                    <p>{{count.questions}} Questions  <span>|</span>  <span class="red">{{count.votes}} Votes</span>  <span>|</span>  {{count.decisions}} Decisions</p>
                </div>
            </div>
        </div>
    </div>
</header>
<!-- Header Wrapper Ends -->
<!-- Search -->
<section class="search">
    <div class="container">
        <div class="row">
            <div class="col-md-12 search-form">
                <div class="form-container">
                    <form>
                        <input type="text" ng-model="searchword" placeholder="Cant conclude? Why dont you SimplyDecide?" />
						<a class="home-search" ui-sref="search({id: searchword})"></a>
                        <!-- <input type="image" src="images/form-search-icon.png" /> -->
                    </form>
                </div>
            </div>
        </div>
    </div>

</section>
<!-- Search Ends -->
<!-- Info graphic -->
<section class="info-graphic">
    <div class="container">
        <div class="row">
            <div class="col-md-6">
                <h2>Simply Decide &trade;</h2>
                <h3>Online community for collective decision making. <br />A product of SimplyDecide LLC.</h3>
                <p>The SimplyDecide&trade; service allows registered members to post questions, vote on a particular choice and in general respond to user surveys to help collective decisions in a whole range of items from a hairpin to a lomborghini.</p>
                <p>SimplyDecide&trade; LLC was founded on May 17, 2013.</p>
            </div>

            <div class="col-md-6">
                <div class="graph-carousel">
                    <div class="top-graph-container">
                        <carousel interval="myInterval">
                            <slide ng-repeat="chart in charts" active="chart.active">
                                <div class="chartElement" ac-chart="chartType" ac-data="chartData[$index]" ac-config="config1"></div>
                                <h4 class="col-md-4 pull-right">{{chart.question}}</h4>
                            </slide>
                        </carousel>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- Info graphic Ends-->
<!-- Icon graphic -->
<section class="icons-graphic">
    <div class="container">
        <div class="row">
            <div class="col-xs-3 col-md-2 col-sm-3 col-lg-3">
                <a class="graphic-icon questions">Post Questions</a>
            </div>
            <div class="col-xs-3 col-md-3 col-sm-3 col-lg-3">
                <a class="graphic-icon response">Responses</a>
            </div>
            <div class="col-xs-3 col-md-3 col-sm-3 col-lg-3">
                <a class="graphic-icon decision">Collective Decisions</a>
            </div>
            <div class="col-xs-3 col-md-3 col-sm-3 col-lg-3">
                <a class="graphic-icon last decide">Simply Decide</a>
            </div>
        </div>
    </div>

</section>
<!-- Icon graphic Ends-->
<!-- Top Data -->
<section class="top-data">
    <div class="container">
        <div class="row">
            <div class="col-md-6">
                <table class="top-trending">
                    <thead>
                        <tr><th>Top Trending Decisions</th><th>Read more</th></tr>
                    </thead>
                    <tbody>
                        <tr  ng-repeat="topic in topTopics">
                            <td>     
                                {{topic.question}}
                            </td>
                            <td></td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <div class="col-md-6">
                <table class="latest-topics">
                    <thead>
                        <tr><th>Top Trending Decisions</th><th>Read more</th></tr>
                    </thead>
                    <tbody>
                        <tr ng-repeat="decision in topDecisions">
                            <td>{{decision.question}}</td>
                            <td></td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</section>